<template>
  <view class="content">
    <view class="top">
      <image
        v-if="baobeiDetail.status == 2"
        src="../../static/tab1/guoqi.png"
        alt=""
      />
      <image
        v-else-if="baobeiDetail.status == 6"
        src="../../static/tab1/black.png"
        alt=""
      />
      <image v-else src="../../static/tab1/tonguo.png" alt="" />
      {{ typeList[baobeiDetail.status] }}
    </view>
    <view class="items">
      <view class="lie">
        <view class="max-text">{{ baobeiDetail.name }}</view>
        <view class="min-text" @click="openShow1" v-if="type == 2">
          <u-icon name="error-circle" size="20"></u-icon>
        </view>
      </view>
      <view class="lie">
        <view class="sex">
          <image src="../../static/tab1/sex.png" alt="" />
          <span style="margin-right: 50rpx">{{
            baobeiDetail.gender_text
          }}</span>
          <image src="../../static/tab1/shengri.png" alt="" />
          <span>{{ baobeiDetail.age }}岁</span>
        </view>
      </view>
      <view class="lie">
        <y-tag :text="baobeiDetail.yname"></y-tag>
        <view class="text-color">{{ typeList[baobeiDetail.status] }}</view>
      </view>
    </view>
    <view class="items">
      <view class="tops">手机号</view>
      <view class="bom">{{ baobeiDetail.phone }}</view>
      <view class="tops">面试公司</view>
      <view class="bom">{{ baobeiDetail.cname }}</view>
      <view class="tops"> 报备时间 </view>
      <view class="bom">{{ baobeiDetail.baobei_time }}</view>
    </view>
    <view class="items" v-if="type == 2">
      <view class="max-text">项目主管审核</view>
      <view class="tops">上报人</view>
      <view class="bom">{{ baobeiDetail.busername }}</view>
      <view class="tops">人员状态</view>
      <view class="bom bet" @click="show = true">
        <view>{{ baobeiDetail.status_text }}</view>
        <u-icon size="14" name="arrow-right" color="#000000"></u-icon>
      </view>
      <view class="tops" v-if="timeShow">
        {{
          baobeiDetail.status_text && baobeiDetail.status_text.substring(1, 3)
        }}时间
      </view>
      <view class="bom bet" @click="shows = true" v-if="timeShow">
        <view>{{ from.time ? getData(from.time, "date") : "请选择" }}</view>
        <u-icon size="14" name="arrow-right" color="#000000"></u-icon>
      </view>
    </view>
    <view class="boxItem" v-if="type == 2">
      <view class="max-text" style="margin-bottom: 20rpx">合同导入</view>
      <view class="bet sc">
        <view class="min-text" style="margin: 0 auto" @click="chooseUpload(1)">
          <view>
            <image src="../../static/tab1/shangchuan.png" alt="" />
          </view>
          <view style="margin-top: 20rpx">只支持xls,xlsx,pdf大小不超过10M</view>
        </view>
      </view>
      <view v-if="fileList.name" class="bet" style="margin: 20rpx 0">
        <view class="flex">
          <u-icon name="file-text" color="#7fca99" size="18"></u-icon>
          <view class="min-text">{{ fileList.name }}</view>
        </view>
        <u-icon name="close" size="18" @click="delFile(1)"></u-icon>
      </view>
    </view>
    <view class="boxItem" v-if="type == 2">
      <view class="max-text" style="margin-bottom: 20rpx">文件导入</view>
      <view class="bet sc">
        <view class="min-text" style="margin: 0 auto" @click="chooseUpload(2)">
          <view>
            <image src="../../static/tab1/shangchuan.png" alt="" />
          </view>
          <view style="margin-top: 20rpx">只支持xls,xlsx,pdf大小不超过10M</view>
        </view>
      </view>
      <view v-if="fileList1.name" class="bet" style="margin: 20rpx 0">
        <view class="flex">
          <u-icon name="file-text" color="#7fca99" size="18"></u-icon>
          <view class="min-text">{{ fileList1.name }}</view>
        </view>
        <u-icon name="close" size="18" @click="delFile(2)"></u-icon>
      </view>
    </view>
    <view class="flexcenter">
    	<button v-if="baobeiDetail.status != 7" @click="fabu" class="button fabu">
    	  保存
    	</button>
    </view>
    <u-picker
      :show="show"
      :columns="columns"
      @confirm="pickerOk"
      @cancel="show = false"
    ></u-picker>
    <u-datetime-picker
      :show="shows"
      v-model="timeVal"
      mode="date"
      minDate="-2211696000000"
      @confirm="timeOk"
      @cancel="timeCancel"
    ></u-datetime-picker>
    <u-modal
      show-title="false"
      :show="showBlack"
      showCancelButton="true"
      :content="test"
      @confirm="goBlack"
      @cancel="showBlack = false"
    ></u-modal>
  </view>
</template>

<script>
import yTag from "@/components/y-tag/index";
export default {
  name: "tab-1",
  components: {
    yTag,
  },
  data() {
    return {
      test: "确定要拉黑吗？",
      from: {
        status: 0,
        time: 0,
        id: 0,
        wenjian: "",
      },
      show: false,
      shows: false,
      timeVal: 0,
      columns: [
        ["已面试", "未面试", "已通过", "未通过", "已入职", "未入职", "已离职"],
      ],
      typeList: [
        "暂无",
        "已报备",
        "未通过",
        "已面试",
        "已通过",
        "已入职",
        "已离职",
        "黑名单",
        "未面试",
        "未入职",
      ],
      type: "",
      id: "",
      fileList: {},
      fileList1: {},
      baobeiDetail: {},
      showBlack: false,
    };
  },
  computed: {
    timeShow() {
      return (
        this.baobeiDetail?.status == 2 ||
        this.baobeiDetail?.status == 3 ||
        this.baobeiDetail?.status == 4 ||
        this.baobeiDetail?.status == 5 ||
        this.baobeiDetail?.status == 6 ||
        this.baobeiDetail.status_text == "未通过" ||
        this.baobeiDetail.status_text == "已面试" ||
        this.baobeiDetail.status_text == "已通过" ||
        this.baobeiDetail.status_text == "已入职" ||
        this.baobeiDetail.status_text == "已离职"
      );
    },
  },
  onLoad(e) {
    this.timeVal = Math.round(new Date());
    this.type = e.type; // 1 文员 2 项目主管
    this.id = e.id;
    this.from.id = e.id;
    this.getDetail();
  },
  methods: {
    async getDetail() {
      const data = await this.http.get(
        this.type == 1 ? "baobei/wendetail" : "baobei/zhudetail",
        { id: this.id }
      );
      this.baobeiDetail = data.data;
	  
	  console.log("这里是判断用户是否入职");
	  console.log(data);
	  
      this.from.time = this.baobeiDetail.last_time
        ? Date.parse(new Date(this.baobeiDetail.last_time)) / 1000
        : "";
      this.from.status = data.data.status;
      if (data.data.hetong) {
        this.from.hetong = data.data.hetong;
        const name = data.data.hetong.split(".");
        this.fileList.name = `合同.${name[1]}`;
      }
      if (data.data.wenjian) {
        this.from.wenjian = data.data.wenjian;
        const name = data.data.wenjian.split(".");
        this.fileList1.name = `文件.${name[1]}`;
      }
    },
    fabu() {
      this.http.post("baobei/modify", this.from).then((res) => {
        if (res.code == 1) {
          this.toast("保存成功");
          setTimeout(() => {
            uni.navigateBack();
          }, 1000);
        } else {
          this.toast(res.msg);
        }
      });
    },
    goBlack() {
      const params = {
        id: this.from.id,
        time: Math.round(new Date() / 1000),
        status: 7,
      };
      this.http.post("baobei/modify", params).then((res) => {
        if (res.code == 1) {
          this.toast("操作成功");
          setTimeout(() => {
            uni.navigateBack();
          }, 1000);
        } else {
          this.toast(res.msg);
        }
      });
    },
    pickerOk(e) {
      const list = ["3", "8", "4", "2", "5", "9", "6"];
      this.from.status = list[e.indexs[0]];
      this.baobeiDetail.status_text = e.value[0];
      this.show = false;
    },
    timeOk(e) {
      this.from.time = e.value / 1000;
      this.timeCancel();
    },
    timeCancel() {
      this.timeVal = Math.round(new Date());
      this.shows = false;
    },
    openShow1() {
      console.log("ssss");
      this.showBlack = true;
    },
    chooseUpload(types) {
      var that = this;
      wx.chooseMessageFile({
        count: 1,
        type: "file",
        extension: [
          ".xlsx",
          ".xls",
          ".XLSX",
          ".XLS",
          "xlsx",
          "xls",
          "XLSX",
          "XLS",
          ".pdf",
          ".PDF",
        ],
        success(res) {
          const tempFilePaths = res.tempFiles;
          console.log(tempFilePaths, "tempFilePaths");
          if (types == 1) {
            that.fileList = tempFilePaths[0];
          } else {
            that.fileList1 = tempFilePaths[0];
          }
          uni.showLoading({ title: "上传中", mask: true });
          for (var i in tempFilePaths) {
            wx.uploadFile({
              url: UpLoad_URL, //"https://small.shiyijia.vip/api/Common/upload", //上传的服务器地址
              filePath: tempFilePaths[i].path,
              name: "file",
              formData: {
                file: tempFilePaths[i].path,
              },

              header: {
                token: uni.getStorageSync("token"),
              },
              success: function (resp) {
                console.log(resp);
                var data = JSON.parse(resp.data);
                console.log(data);
                if (types == 1) {
                  that.from.hetong = data.data.url;
                } else {
                  that.from.wenjian = data.data.url;
                }
                console.log(that.from.hetong, "that.from.hetong");
                uni.hideLoading();
                setTimeout(() => {
                  if (data.code == 1) {
                    uni.showToast({
                      title: "上传成功",
                      icon: "none",
                      duration: 1300,
                    });
                  } else {
                    uni.showToast({
                      title: data.message,
                      icon: "none",
                      duration: 2000,
                    });
                  }
                }, 100);
              },
              fail: function (err) {
                console.log(err);
              },
            });
          }
        },
      });
    },
    delFile(type) {
      if (type == 1) {
        this.fileList = {};
        this.from.hetong = "";
      } else {
        this.fileList1 = {};
        this.from.wenjian = "";
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.top {
  height: 250rpx;
  background-color: #c1282d;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  image {
    margin-right: 10rpx;
    width: 40rpx;
    height: 40rpx;
  }
}
.items {
  padding: 20rpx;
  background: rgba(255, 255, 255, 0.5);
  opacity: 1;
  margin: 30rpx 30rpx 0;
  border-radius: 10rpx;
  align-items: center;
  .tops {
    color: #000000;
    font-size: 28rpx;
    margin: 20rpx 0;
    font-weight: 300;
  }
  .bom {
    color: #000000;
    font-size: 28rpx;
    font-weight: 600;
    margin-bottom: 40rpx;
  }
  .topss {
    color: #000000;
    font-size: 28rpx;
    font-weight: 300;
    margin: 20rpx 0;
  }
  .boms {
    color: #000000;
    font-size: 28rpx;
    margin-bottom: 20rpx;
  }
  .lie {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20rpx;
    .sex {
      display: flex;
      align-items: center;
      font-size: 24rpx;
      color: #8e8e93;
      image {
        width: 24rpx;
        height: 24rpx;
        margin-right: 10rpx;
      }
    }
  }
}
.fabu {
  width: 80%;
  margin-top: 50rpx;
  margin-bottom: 50rpx;
}
.sc {
  height: 300rpx;
  background-color: #f5f5f5;
  text-align: center;
  image {
    width: 66rpx;
    height: 56rpx;
  }
}
</style>